<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 
        元素类型转换
            block;
            inline;
            inline-block;

        元素类型转换(强制/显式  => 官方提供的专门用于数据类型转换)
            display:block;
            display:inline;
            display: inline-block;

        元素类型转换(隐式  => 浏览器默认转化机制(规律))
            float / position() => 块级


     -->

    <p>
        <input id="inp" type="text" value=""><button id="btn">点击</button>
    </p>


    </body>
<script>
    // JS基本数据类型
    //  string number  boolean  null undefined           object(array)


    // 数据类型转换  (强制类型转换 和 隐式类型转换)

    // 强制类型转换的方法  String()  Number()  Boolean()
    // String()     把其他类型转化为字符串类型
    // Number()     把其他类型转化为数字类型
    // Boolean()    把其他类型转化为布尔类型



    //  String()     把其他类型转化为字符串类型 (将数据包裹到字符串中即可)
    // console.log(String("hello")); // "hello"
    // console.log(String(100)); // "100"
    // console.log(String(true)); // "true"
    // console.log(String(false)); // false
    // console.log(String(null));  // "null"
    // console.log(String(undefined)); //"undefined"


    // Number()     把其他类型转化为数字类型
    // (1)  纯数字类型的字符串 => 直接转数字
    //      非纯数字类型的字符串 => NaN
    // (2)  true转数字类型 1   false转数字类型0
    // (2)  null转数字类型0  undefined转数字类型NaN 


    // var result = Number("100");  // 先存储转化后的结果
    // console.log(result);   // 打印结果

    // console.log(1 / 0);  // Infinity (正无穷)    

    // console.log(Number("100"));
    // console.log(Number("hello"));  // NaN  (not a number => 表示非数字(结果不是一个数字))
    // console.log(Number("100px"));  // NaN  (not a number => 表示非数字(结果不是一个数字))
    // console.log(Number(10));  
    // console.log(Number(true));  
    // console.log(Number(false));  
    // console.log(Number(null));  
    // console.log(Number(undefined));  


    // Boolean()    把其他类型转化为布尔类型
    // "" 0 NaN false null undefined 转布尔值为false,其他的均为true


    // console.log(Boolean("100"));  // true
    // console.log(Boolean("hello")); // true
    // console.log(Boolean(" "));  // true
    // console.log(Boolean(""));  // false

    console.log(Boolean(100));  // true
    console.log(Boolean(1));  // true 
    console.log(Boolean(Infinity));  // true
    console.log(Boolean(0));  // false
    console.log(Boolean(NaN));  // false
    
    console.log(Boolean(null));  // false
    console.log(Boolean(undefined));  // false






</script>

<script>
    // "我有"  n "头小毛驴"; =>  "我有10头小毛驴"

    // var inp = document.getElementById("inp");
    // var btn = document.getElementById("btn");
    // console.log(inp);
    // console.log(btn);

    // btn.onclick = function(){
    //     // alert(111);
    //     console.log(inp.value)
    // }
</script>
</html>